<template>
  <div class="main-container-app">
    <el-row class="form-contain">
      <ele-pay-det-form
        @tableLoad="tableLoad"
        @tableData="tableData"
        :pageNum="pageNum"
        :pageSize="pageSize"
        :ranNum="ranNum">
      </ele-pay-det-form>
    </el-row>
    <div class="table-contain">
      <ele-pay-det-table
        @pageNums="pageNums"
        @sizePage="changePageSize"
        :loading="loading"
        :tableDatas="tableDatas">
      </ele-pay-det-table>
    </div>
  </div>
</template>

<script>
  /* eslint-disable */
  import elePayDetForm from './elePayDetChild/elePayDetForm'
  import elePayDetTable from './elePayDetChild/elePayDetTable'
  export default {
    data() {
      return {
        ranNum: 0,
        pageNum: 1, // 当前页码
        pageSize: 10,
        tableDatas: [], // 表单数据
        loading: false, // 表格加载效果
        dialogParkvisible: false, // 选择车场弹出框
        dialogRoadVisible: false, // 选择收费路段弹出框
        dialogPersonVisible: false, // 选择收费员弹出框
      }
    },
    methods: {
      /* 表格loading效果 */
      tableLoad: function (val) {
        this.loading = val
      },
      /* 表单数据 */
      tableData: function (val) {
        this.tableDatas = val
      },
      /* 传递当前页码 */
      pageNums: function (val) {
        this.pageNum = val
      },
      changePageSize: function (val) {
        this.pageSize = val
      },
      /* 执行完操作后触发查询 */
      tiggerSearch: function (val) {
        this.ranNum = val
      },
      /* 车场弹出框 */
      openParkDialog(val) {
        this.dialogParkvisible = val
        this.parkLoading = val
      },
    },
    components: {
      elePayDetForm,
      elePayDetTable
    }
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>
